There are tons of paid options like flashloaded.com’s FlashTickerFX (34.99) which I recommend if 1. you have flash 2. you are familiar with flash and flash components and 3. are going to be reimbursed – and there are also a ton of free options that use javascript or ajax/jquery. But the only GOOD free option that I could find using flash that loaded images from an xml file was by benjaminkeen.com – his flash ticker is free, and there is a healthy amount of community support in his forums. I’m going to go through a very quick how to guide on how I got it to work..
Requirements
- FTP access to your webserver
- Dreamweaver or a text editor
Limitations
The only limitation I ran into was that the images have to be a perfect square. (if you want it to look decent anyways – it works off of a perfect square model, so images that are not a perfect square will work – but you have to make sure you alter the ‘size’ to be the largest value of width or height of any of your images, otherwise they will be cut off.) If you are OK with that, you’re good to go on to the next step.
Download
Download my altered version (I am going to write this article assuming that you downloaded this archive)
or you can opt to download the latest release from his site if you’re comfortable with code (in which case you won’t need this tutorial..) Latest release was 1.71 at the time this article was written – and that is what my altered version is based off of.
Extract
Extract the zip file to a folder
Images
You are going to need to make your images 55×55 resolution, and in .jpg format. I included some as examples – be sure to delete these if you are adding your own.
If you want to use a different size go ahead, but as I mentioned in the limitations you will need to alter some code in the index.html file: Alter the size of the image on line 30 in the index.html file. Match/change the stage height in line 29 above it. And if you want a different width for the whole flash movie that is line 28 – it’s set to 680 (pixels) right now.
Configure
Open up info.xml
Enter in the full URL of each image between the <thumbURL> & </thumbURL> tags (like this: http://www.yourwebsite.com/ticker/images/image01.jpg ). If you run out of thumbURL tags, just go ahead and copy and paste everything between the <item> and </item> tags (including those tags). You can also add your info to the other parameters if you wish. LinkURL is the link that the image leads to when clicked. caption (untested) is text that describes the image & target is specifying whether or not you want the link to open in a new window or a specific frame. You can use “_blank” for a new window. (without the quotation marks of course) – if you don’t put anything in the target field it will default to the window that the ticker is in and the visitor will leave your page.
That’s pretty much it! If it doesn’t look how you want you can open up index.html and alter some of the parameters – see Benjamin’s comprehensive list here (click on configuration options in the right hand menu). And if you copy and paste any of them into the index.html file, be sure to add a 3 after “so” like this: so3.addVariable instead of so.addVariable – you will get an error on the page if you forget to do this.
The Lazy way
If you just want to load a whole folder in favor of identifying each image in the info.xml file do this:
open index.html and change lines 25 & 26 from this:
so3.addVariable(“sourceFile”, “info.xml”);
so3.addVariable(“fileType”, “xml”);
to this:
so3.addVariable(“sourceFile”, “get_folder_images.php”);
so3.addVariable(“fileType”, “text”);
Then open the get_folder_images.php file and change lines 26 & 27 from this:
$image_folder_dir = “./images”;
$image_folder_url = “http://www.yourwebsite.com/ticker/images”;
to reflect your personal website URL. Unless you changed the name of the images folder in the zip you downloaded, leave the first line alone- and just substitute http://www.yourwebsite.com/ticker with your URL. And you should be good to go – doesn’t get much easier than that.
Did you appreciate this article? Please click here to donate.
Tech Chronicle 
